<template>
	<div class='content-box'>
		<div style='padding:50px 0px 50px 200px;'>
			<div style='width:600px;'>
				<el-form :model='formData' :rules='rules' ref='formData' label-width='100px' label-position='left'>
					<el-form-item label='LOGO' prop='photo'>
						<upload v-on:upload='formData.photo=$event' :fileUrl='photoUrl'></upload>
					</el-form-item>
					<el-form-item label='昵称' prop='name'>
						<el-input type='text' v-model='formData.name' autocomplete='off'></el-input>
					</el-form-item>
					<el-form-item label='' class='m-t-50'>
						<el-button @click='$router.go(-1)'>返回</el-button>
						<el-button @click='submit' class='m-l-20' type='primary'>保存</el-button>
					</el-form-item>
				</el-form>
			</div>
		</div>
	</div>
</template>

<script>
	import { Request, successToast, errorToast, setUserInfo } from '@/utils'
	import upload from '@/components/upload.vue'
	
	let request = new Request()
	
	export default {
		data() {
			return {
				photoUrl : '',
				
				formData : {
					photo : '',
					name : ''
				}
			}
		},
		
		methods : {
			submit : function(){
				let data = this.formData
				if(data.name === '' && data.photo === '') return
				request.post('home/set/peronInfoEdit', res => {
					if(res.code == 0){
						successToast('保存成功', this)
						setUserInfo({nickname : this.formData.name, avatar : this.formData.photo})
						location.reload()
					}else{
						errorToast(res.msg, this)
					}
				}, this.formData)
			}
		},
		
		components : {
			upload
		},
		
		created () {
			request.get('home/set/personData', res => {
				if(res.code == 0){
					let data = res.data
					for(let k in this.formData){
						this.formData[k] = data[k]
					}
					
					this.photoUrl = this.formData.photo
				}
			})
		}
	}
</script>

<style>

</style>
